import {nextTick} from 'vue';
import '/@/theme/loading.scss';

/**
 * 页面全局 Loading
 * @method start 创建 loading
 * @method done 移除 loading
 */
export const NextLoading = {
    // 创建 loading
    start: () => {
        if (window.nextLoading) return;
        window.nextLoading = true;

        const div = document.createElement('div');
        div.classList.add('loading-next');
        div.innerHTML = `
      <div class="loading-next-box">
        <div class="loading-next-box-warp">
          ${'<div class="loading-next-box-item"></div>'.repeat(9)}
        </div>
      </div>
    `;
        document.body.insertBefore(div, document.body.firstChild);
    },
    // 移除 loading
    done: async (time: number = 0) => {
        if (!window.nextLoading) return;
        window.nextLoading = false;

        await nextTick(() => {
            setTimeout(() => {
                const el = document.querySelector('.loading-next');
                el?.parentNode?.removeChild(el);
            }, time);
        });
    },
};
